<template>
   <div class="index_map_con" ref="indexMap"></div>
</template>

<script>
import World  from '../../assets/js/World.json'
export default {
   
    data(){
        return{
            mapWorld:[]
        }
    },
    created(){
        this.mapWorld=World
    },
    mounted(){
        this.initMap()
    },
    methods:{
      initMap(){
        let mapEChart=this.$echarts.init(this.$refs.indexMap);
        var data = [
            // {
            //     name: 'American Samoa',
            //     value: 40
            // },
            // {
            //     name:'澳大利亚',
            //     value:5228
            // },
            // {
            //     name:'加拿大',
            //     value:10307
            // },
            // {
            //     name:'中国',
            //     value:3571
            // },
            // {
            //     name:'俄罗斯',
            //     value:527362
            // },
            // {
            //     name:'蒙古',
            //     value:6988
            // },
            // {
            //     name:'蒙古',
            //     value:6988
            // },
            // {
            //     name:'哈萨克斯坦',
            //     value:109494
            // },
            //  {
            //     name:'美国',
            //     value:6051160
            // },
            // {
            //     name:'格陵兰',
            //     value:64
            // },
            //  {
            //     name:'巴西',
            //     value:694959
            // },
            // {
            //     name:'阿根廷',
            //     value:241675
            // }
            {
            "name": "加拿大",
            "value": 12052
            },{
            "name": "巴西",
            "value": 675385
            },{
            "name": "格陵兰",
            "value": 71
            },{
            "name": "美国",
            "value": 6223361
            },{
            "name": "墨西哥",
            "value": 390088
            },{
            "name": "危地马拉",
            "value": 37121
            },{
            "name": "圭亚那",
            "value": 794
            },{
            "name": "阿根廷",
            "value": 239453
            },{
            "name": "玻利维亚",
            "value": 44132
            },{
            "name": "苏里南",
            "value": 3104
            },{
            "name": "委内瑞拉",
            "value": 10255
            },{
            "name": "多米尼加",
            "value": 11962
            },{
            "name": "古巴",
            "value": 46802
            },{
            "name": "冰岛",
            "value": 1384
            },{
            "name": "哥伦比亚",
            "value": 63697
            },{
            "name": "厄瓜多尔",
            "value": 16163
            },{
            "name": "南非",
            "value": 157156
            },{
            "name": "马达加斯加",
            "value": 649
            },{
            "name": "纳米比亚",
            "value": 18569
            },{
            "name": "博茨瓦纳",
            "value": 17528
            },{
            "name": "津巴布韦",
            "value": 22724
            },{
            "name": "安哥拉",
            "value": 2127
            },{
            "name": "赞比亚共和国",
            "value": 3659
            },{
            "name": "肯尼亚",
            "value": 10926
            },{
            "name": "俄罗斯",
            "value": 534279
            },{
            "name": "中国",
            "value": 3671
            },{
            "name": "澳大利亚",
            "value": 5908
            },{
            "name": "日本",
            "value": 139112
            },{
            "name": "哈萨克斯坦",
            "value": 108818
            },{
            "name": "韩国",
            "value": 24330
            },{
            "name": "菲律宾",
            "value": 78480
            },{
            "name": "印度尼西亚",
            "value": 448508
            },{
            "name": "巴布亚新几内",
            "value": 198
            },{
            "name": "新西兰",
            "value": 37
            },{
            "name": "蒙古",
            "value": 5951
            },{
            "name": "柬埔寨",
            "value": 4259
            },{
            "name": "泰国",
            "value": 211223
            },{
            "name": "挪威",
            "value": 51577
            },{
            "name": "英国",
            "value": 1296101
            },{
            "name": "爱尔兰",
            "value": 36560
            },{
            "name": "瑞典",
            "value": 11780
            },{
            "name": "芬兰",
            "value": 65672
            },{
            "name": "坦桑尼亚",
            "value": 813
            },{
            "name": "刚果（金）",
            "value": 20748
            },{
            "name": "乌干达",
            "value": 2039
            },{
            "name": "加蓬",
            "value": 43
            },{
            "name": "刚果（布）",
            "value": 693
            },{
            "name": "几内亚",
            "value": 1893
            },{
            "name": "科特迪瓦",
            "value": 853
            },{
            "name": "尼日利亚",
            "value": 10334
            },{
            "name": "柯麦隆",
            "value": 297
            },{
            "name": "索马里",
            "value": 7288
            },{
            "name": "埃塞俄比亚",
            "value": 15428
            },{
            "name": "南苏丹",
            "value": 487
            },{
            "name": "中非共和国",
            "value": 4238
            },{
            "name": "多哥",
            "value": 1887
            },{
            "name": "布基纳法索",
            "value": 50
            },{
            "name": "毛里塔尼亚",
            "value": 3692
            },{
            "name": "尼日尔",
            "value": 90
            },{
            "name": "乍得",
            "value": 8
            },{
            "name": "苏丹",
            "value": 3495
            },{
            "name": "南苏丹",
            "value": 487
            },{
            "name": "厄立特里亚",
            "value": 62
            },{
            "name": "埃及",
            "value": 34909
            },{
            "name": "利比亚",
            "value": 65859
            },{
            "name": "阿尔及利亚",
            "value": 55716
            },{
            "name": "摩洛哥",
            "value": 73510
            },{
            "name": "葡萄牙",
            "value": 44734
            },{
            "name": "西班牙",
            "value": 712457
            },{
            "name": "法国",
            "value": 420871
            },{
            "name": "波兰",
            "value": 154253
            },{
            "name": "德国",
            "value": 38157
            },{
            "name": "荷兰",
            "value": 168711
            },{
            "name": "瑞士",
            "value": 22751
            },{
            "name": "马来西亚",
            "value": 227230
            },{
            "name": "菲律宾",
            "value": 78480
            },{
            "name": "越南",
            "value": 145217
            },{
            "name": "老挝",
            "value": 4461
            }
        ]
        this.$echarts.registerMap('world', this.mapWorld);
        let option = {
            tooltip: {
                triggerOn: "click",
            },
            visualMap: {
                min: 19000,
                max: 70000,
                left: 16,
                bottom: 40,
                showLabel: true,
                pieces: [{
                    gt: 10000,
                    label: "10000人及以上",
                    color: "#C92327"
                }, {
                    gte: 1000,
                    lte: 9999,
                    label: "1000-9999 人",
                    color: "#E45236"
                }, {
                    gte: 500,
                    lte: 999,
                    label: "500-999 人",
                    color: "#EC7954"
                }, {
                    gte:100,
                    lte:499,
                    label: "100-499 人",
                    color: "#FFA36F"
                }, {
                    gte: 10,
                    lte: 99,
                    label: "10-99 人",
                    color: "#F9CAA5"
                }, {
                    gte: 1,
                    lte: 9,
                    label: "1-9 人",
                    color: "#FFE3D0"
                }, {
                    value:0,
                    color: "#fbfbfb"
                }],
                textStyle:{
                    color:'#24C2FF'
                },
            },
            geo: {
                map: 'world',
                zoom: 1.2,
                label: {
                    show: false,
                    color: '#000000'
                },
                roam: false,
                itemStyle: {
                    areaColor: '#fbfbfb',
                    borderColor: '#3399FF',
                },
                emphasis: {
                    itemStyle:{
                        areaColor: '#CC9933'
                    }
                        
                }
            },
            series: [{
                name:'现有确诊病例',
                type: 'map',
                geoIndex: 0,
                data: data
            }]
        };
        mapEChart.setOption(option);
      }
    }
    
}
</script>


<style lang="less" scoped>
.index_map_con{
    width: 890px;
    height: 440px;
}

</style>